開發者工具（Developer Tools）是網頁開發者最重要的武器之一，它內建在所有主流瀏覽器中，能幫助我們檢查、除錯和優化網頁。

常用的功能：

• Elements (元素)： 檢查 HTML 結構和 CSS 樣式。點擊任何一個元素，右側就會顯示它的樣式。
• Console (控制台)： 查看 JavaScript 錯誤或輸出訊息。
• Sources (來源)： 查看和編輯原始碼。
• Network (網路)： 檢查網頁載入速度、請求等。
• Responsive Mode (響應式模式)： 模擬不同裝置的螢幕尺寸。

開啟作品集網頁，按下 F12 或 Ctrl+Shift+I，打開開發者工具。

1. 檢查元素： 點擊你的導覽列連結，檢查它的 CSS 樣式，看 hover 效果是否正常。
2. 響應式模式： 切換到手機模式，檢查你的 RWD 效果。
3. 除錯： 如果你的 JavaScript 互動沒有生效，可以檢查 Console 是否有錯誤訊息。
   熟練使用開發者工具，能讓開發效率大大提升。

執行成果 :